<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />

  <title>HTML5 Gamepad Tester</title>

  <meta content="width=600" name="viewport" />
  <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
  <link href="//fonts.googleapis.com/css?family=Roboto:100,300" rel="stylesheet" type="text/css" />

  <script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
  <script>
    (adsbygoogle = window.adsbygoogle || []).push({
      google_ad_client: "ca-pub-2042748920214268",
      enable_page_level_ads: true
    });
  </script>
</head>

<body>
  <a href="https://github.com/bwiklund/gamepad.js">
    <img alt="Fork me on GitHub"
      data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_white_ffffff.png"
      src="https://github-camo.global.ssl.fastly.net/52760788cde945287fbb584134c4cbc2bc36f904/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f77686974655f6666666666662e706e67"
      style="position: absolute; top: 0; right: 0; border: 0;" />
  </a>
  <h1>
    HTML5 Gamepad Tester
    <div class="icon icon-gamepad"></div>
  </h1>

  <p class="subtitle">Displays info about all gamepads connected to your computer</p>
  <p class="hint">Press any button on your gamepad(s) to make them show up</p>

  <noscript>You need to enable JavaScript to run this app.</noscript>
  <div id="root"></div>

  <div class="faq">
    <h2>FAQ</h2>
    <div class="question">Why isn't my gamepad showing up?</div>
    <div class="answer">The Gamepad API is still inconsistent across browsers and OSes. Some things to check:
      <ul>
        <li>Is the device plugged in / connected via bluetooth</li>
        <li>Press some buttons. On some devices, only certain buttons will wake up the gamepad API (the shapes on PS3
          controllers, for instance)</li>
        <li>Close other apps that may be using the gamepad</li>
        <li>Restart your web browser</li>
      </ul>
    </div>
    <div class="question">What information is being displayed here?</div>
    <div class="answer">Multiple gamepads can be connected to a computer at once. This displays them all, and their current state.
      <ul>
        <li>Timestamp: the time of the latest update from the gamepad</li>
        <li>Axis [N]: The current position of the gamepad's analog inputs</li>
        <li>B [N]: The current on/off position of buttons. Supports analog buttons.</li>
      </ul>
    </div>
    <div class="question">Does vibration work?</div>
    <div class="answer">Chrome is, so far, the only browser that supports vibration.</div>
    <div class="question">What about experiemental features?</div>
    <div class="answer">Features like Pose, HapticActuators, and others, are not widely supported yet.<br>Once browsers start supporting them, this page will be updated.</div>
    <div class="question">Why are the axis values weird?</div>
    <div class="answer">Not all controllers are reported the same way, across devices, browsers, and OSes.<br>This site simply displays what the Gamepad API returns.</div>
  </div>

  <script type="text/javascript">(function (i, s, o, g, r, a, m) {
      i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
        (i[r].q = i[r].q || []).push(arguments)
      }, i[r].l = 1 * new Date(); a = s.createElement(o),
        m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
    })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
    ga('create', 'UA-2463077-16', 'html5gamepad.com');
    ga('send', 'pageview');</script>

</body>
</body>

</html>